<template>
  <el-form ref="genInfoForm" :model="info" :rules="rules" label-width="150px" class="dataForm">
    <el-row>
      <el-col :span="12">
        <el-form-item prop="tplCategory">
          <span slot="label">{{ $t('生成模板') }}</span>
          <el-select v-model="info.tplCategory">
            <el-option :label="$t('单表（增删改查）')" value="crud" />
            <el-option :label="$t('单表（增删改查-带流程）')" value="menuProcess" />
            <!--// <el-option :label="$t('树表（增删改查）" value="tree" disabled />-->
            <el-option :label="$t('业务流程表单')" value="busNode" />
          </el-select>
        </el-form-item>
      </el-col>

      <el-col :span="12">
        <el-form-item prop="packageName">
          <span slot="label">
            {{ $t('生成包路径') }}
            <el-tooltip :content="$t('生成在哪个java包下')" placement="top">
              <i class="el-icon-question" />
            </el-tooltip>
          </span>
          <el-input v-model="info.packageName" />
        </el-form-item>
      </el-col>

      <el-col :span="12">
        <el-form-item prop="moduleName">
          <span slot="label">
            {{ $t('生成模块名') }}
            <el-tooltip :content="$t('可理解为子系统名，例如 system')" placement="top">
              <i class="el-icon-question" />
            </el-tooltip>
          </span>
          <el-input v-model="info.moduleName" />
        </el-form-item>
      </el-col>

      <el-col :span="12">
        <el-form-item prop="businessName">
          <span slot="label">
            {{ $t('生成业务名') }}
            <el-tooltip :content="$t('可理解为功能英文名，例如 user')" placement="top">
              <i class="el-icon-question" />
            </el-tooltip>
          </span>
          <el-input v-model="info.businessName" />
        </el-form-item>
      </el-col>

      <el-col :span="12">
        <el-form-item prop="functionName">
          <span slot="label">
            {{ $t('生成功能名') }}
            <el-tooltip :content="$t('用作类描述，例如 用户')" placement="top">
              <i class="el-icon-question" />
            </el-tooltip>
          </span>
          <el-input v-model="info.functionName" />
        </el-form-item>
      </el-col>
    </el-row>

    <el-row v-show="info.tplCategory == 'tree'">
      <h4 class="form-header">{{ $t('其它信息') }}</h4>
      <el-col :span="12">
        <el-form-item>
          <span slot="label">
            {{ $t('树编码字段') }}
            <el-tooltip :content="$t('树显示的编码字段名， 如：dept_id')" placement="top">
              <i class="el-icon-question" />
            </el-tooltip>
          </span>
          <el-select v-model="info.treeCode" :placeholder="$t('请选择')">
            <el-option
              v-for="column in info.columns"
              :key="column.columnName"
              :label="column.columnName + '：' + column.columnComment"
              :value="column.columnName"
            />
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item>
          <span slot="label">
            {{ $t('树父编码字段') }}
            <el-tooltip :content="$t('树显示的父编码字段名， 如：parent_Id')" placement="top">
              <i class="el-icon-question" />
            </el-tooltip>
          </span>
          <el-select v-model="info.treeParentCode" :placeholder="$t('请选择')">
            <el-option
              v-for="column in info.columns"
              :key="column.columnName"
              :label="column.columnName + '：' + column.columnComment"
              :value="column.columnName"
            />
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="12">
        <el-form-item>
          <span slot="label">
            {{ $t('树名称字段') }}
            <el-tooltip :content="$t('树节点的显示名称字段名， 如：dept_name')" placement="top">
              <i class="el-icon-question" />
            </el-tooltip>
          </span>
          <el-select v-model="info.treeName" :placeholder="$t('请选择')">
            <el-option
              v-for="column in info.columns"
              :key="column.columnName"
              :label="column.columnName + '：' + column.columnComment"
              :value="column.columnName"
            />
          </el-select>
        </el-form-item>
      </el-col>
    </el-row>
  </el-form>
</template>
<script>
export default {
  name: 'BasicInfoForm',
  props: {
    info: {
      type: Object,
      default: null
    }
  },
  data() {
    return {
      rules: {
        tplCategory: [
          { required: true, message: this.$t('请选择'), trigger: 'blur' }
        ],
        packageName: [
          { required: true, message: this.$t('必填信息'), trigger: 'blur' }
        ],
        moduleName: [
          { required: true, message: this.$t('必填信息'), trigger: 'blur' }
        ],
        businessName: [
          { required: true, message: this.$t('必填信息'), trigger: 'blur' }
        ],
        functionName: [
          { required: true, message: this.$t('必填信息'), trigger: 'blur' }
        ]
      }
    }
  },
  created() {}
}
</script>
